<template>
  <el-dialog
    :before-close="handleClose"
    :visible.sync="dialogVisible"
    title="赠送"
    width="700px"
  >
    <el-form
      ref="ruleForm"
      :model="ruleForm"
      :rules="rules"
      class="demo-ruleForm"
      label-width="100px"
    >
      <el-form-item label="用户编号" prop="user_code">
        <el-input
          v-model="ruleForm.user_code"
          placeholder="请输入用户编号"
          style="width: 80%;"
        ></el-input>
      </el-form-item>
      <el-form-item label="礼物数量" prop="gift_num">
        <el-input
          v-model="ruleForm.gift_num"
          placeholder="请输入礼物数量"
          style="width: 80%;"
        ></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <!-- :loading="submitLoading" -->
      <el-button type="primary" @click="handleSubmit('ruleForm')"
      >提交</el-button
      >
    </span>
  </el-dialog>
</template>

<script>
import { sendPostData } from '@/api/roomGift/giftList'

export default {
  name: '',
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    id: {
      type: Number
    },
    higherId: {
      type: Number
    }
  },
  data() {
    return {
      ruleForm: {
        gift_id: undefined,
        user_code: undefined,
        gift_num: undefined
      },
      rules: {
        gift_num: [
          { required: true, message: '请输入礼物数量', trigger: 'blur' }
        ],
        user_code: [
          { required: true, message: '请输入用户编号', trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    handleClose() {
      this.ruleForm = {
        gift_id: undefined,
        user_code: undefined,
        gift_num: undefined
      }
      this.$emit('update:dialogVisible', false)
    },
    handleSubmit(formName) {
      this.ruleForm.gift_id = this.id
      this.ruleForm.higher_id = this.higher_id
      this.$refs[formName].validate(async valid => {
        if (valid) {
          sendPostData(this.ruleForm).then(res => {
            if (res.code === 200) {
              this.$notify({
                type: 'success',
                message: '赠送成功',
                position: 'bottom-right',
                showClose: false,
                duration: 3000
              })
              this.$emit('update:dialogVisible', false)
              this.handleClose()
            }
          })
        } else {
          return false
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped></style>
